<script src="app/controllers/blogs/SiteManagementController.js"></script>

<div class="hfr-loading" ng-class="{true:'hfr-showContent', false:''}[showViewContent]" ng-controller="SitemapManagementController">
	<div class="hfr-contentLoadingBar">
		<div id="dot1" class="loader-dot"></div>
		<div id="dot2" class="loader-dot"></div>
		<div id="dot3" class="loader-dot"></div>
	</div>
	<div class="hfr-loadingStatus">
		
		<!-- VIEW Site Management
    	================================================== -->
		<div id="hfr-siteManagement" class="hfr-margin-auto container">

			<h2 class="hfr-heading">
				{{'static.layout.siteManagement' | translate}}
				<a href class="hfr-btnFilter" ng-click="isCollapsed = !isCollapsed" >
					<span class="ti-filter" tooltip-placement="top" tooltip="{{'static.layout.filter' | translate}}"></span>
				</a>
			</h2>
			
			<form method="post" action="">
				<div class="hfr-loading" ng-class="{true:'hfr-showContent', false:''}[showSiteManagement]">
					<div class="hfr-contentLoadingBar">
						<div id="dot1" class="loader-dot"></div>
						<div id="dot2" class="loader-dot"></div>
						<div id="dot3" class="loader-dot"></div>
					</div>
					<div class="hfr-loadingStatus">
						<div class="hfr-siteFilter" collapse="!isCollapsed">
							<div class="hfr-inner">
								<div class="row">
									<div class="col-md-4">
										<div class="form-group">
											<label for="">{{'static.siteManagement.sitemap' | translate}}</label>
											<input type="text" class="form-control" ng-model="search.url" placeholder="Filter by Sitemap">
										</div>
										<div class="form-group">
											<label for="">{{'static.siteManagement.typeFilter' | translate}}</label>
											<ul class="hfr-inputStyle list-3-cols">
												<li>
													<input type="radio" id="hfr-siteTypeAll" name="hfr-siteType" ng-model="siteType" value="All" ng-checked="true">
													<label for="hfr-siteTypeAll">{{'static.siteManagement.typeAll' | translate}}</label>
												</li>
												<li>
													<input type="radio" id="hfr-siteTypeWordpress" name="hfr-siteType" ng-model="siteType" value="Wordpress">
													<label for="hfr-siteTypeWordpress">{{'static.siteManagement.typeWordpress' | translate}}</label>
												</li>
												<li>
													<input type="radio" id="hfr-siteTypeBlogger" name="hfr-siteType" ng-model="siteType" value="Blogger">
													<label for="hfr-siteTypeBlogger">{{'static.siteManagement.typeBlogger' | translate}}</label>
												</li>
											</ul>
										</div>
									</div>
									<div class="col-md-8">
										<div class="form-group">
											<label for="">{{'static.siteManagement.blogFilter' | translate}}</label>
											<ul class="hfr-inputStyle list-3-cols">
												<li ng-repeat="topic in topics">
													<input type="checkbox" id="hft-topic-{{topic.id}}" name="hft-topic-{{topic.id}}" ng-model="checkTopic[topic.id]"/>
													<label for="hft-topic-{{topic.id}}">{{topic.name}}</label>
												</li>
											</ul>
										</div>
									</div>
								</div>
							</div>
						</div>

						<ul class="hfr-listSite">
							<li>
								<div class="number">#</div>
								<div class="hfr-listSiteInfo row">
									<div class="col-md-5">{{'static.siteManagement.formName' | translate}}</div>
									<div class="col-md-4">{{'static.siteManagement.topics' | translate}}</div>
								</div>
							</li>
							<li ng-show="totalBlog == 0">
								<div class="hfr-noContent">{{'static.layout.noResult' | translate}}</div>
							</li>
							<!-- Repeat blog -->
							<li ng-repeat="blog in showBlogs | filter:search">
								<div class="number">{{$index + 1}}</div>
								<div class="hfr-listSiteInfo row">
									<div class="col-md-5 siteName">{{blog.url}}</div>
									<div class="col-md-4 siteName"><span ng-repeat="topic in blog.topics"><span ng-if="$index > 0">, </span>{{topic.name}}</span></div>
									<div class="col-md-3 action">
										<a tooltip-placement="top" tooltip="{{'static.siteManagement.viewSitemap' | translate}}" class="ti-align-left hfr-btnViewSitemap hfr-button-blue hfr-shrink" ng-click="viewSitemap(blog.url)" ng-class="{'active':showSelector[blog.url] && showSelectorContent[blog.url] && totalSelector[blog.url] >= 0}" href></a>
										<a tooltip-placement="top" tooltip="{{'static.layout.edit' | translate}}" class="ti-pencil hfr-button-green hfr-shrink" ng-click="editBlog(blog.url, blog.type)" href></a>
										<a tooltip-placement="top" tooltip="{{'static.siteManagement.editTopic' | translate}}" class="ti-folder hfr-button-yellow hfr-shrink" ng-click="changeTopic(blog.url)" href></a>
										<a tooltip-placement="top" tooltip="{{'static.layout.delete' | translate}}" class="ti-close hfr-button-red hfr-shrink" ng-click="deleteBlog(blog.url)" href></a>
									</div>
								</div>
								
								<div class="hfr-loading hfr-preShow" 
									ng-class="{'hfr-show':showSelector[blog.url], 'hfr-showContent': showSelectorContent[blog.url], 'hfr-showReloadSection' : showReloadSelector[blog.url]['display']}">
									<div class="hfr-contentLoadingBar">
										<div id="dot1" class="loader-dot"></div>
										<div id="dot2" class="loader-dot"></div>
										<div id="dot3" class="loader-dot"></div>
									</div>
									<div class="hfr-reloadSection">
										Can't connet to server. <!-- {{showReloadSelector[blog.url]['text']}} -->
										<a href ng-click="getSelector(blog.url)"><ins>{{'static.layout.reload' | translate}}</ins></a>
									</div>
									<div class="hfr-loadingStatus">
										<div class="hfr-viewSitemap">
											<div class="hfr-inner">
												<div class="hfr-noContent" ng-show="totalSelector[blog.url] == 0">{{'static.layout.noResult' | translate}}</div>
												<table class="table" ng-show="totalSelector[blog.url] > 0">
													<thead>
														<tr>
															<th>{{'static.siteManagement.sitemap' | translate}}</th>
															<th>{{'static.siteManagement.action' | translate}}</th>
														</tr>
													</thead>
													<tbody>
														<tr ng-repeat="selector in selectors[blog.url]">
															<td><a href="{{selector.sitemapId}}" target="_blank"title="View Selector">{{selector.sitemapId}}</a></td>
															<td>
																<a tooltip-placement="top" tooltip="{{'static.layout.edit' | translate}}" href ng-click="editSitemap(selector.id, blog.url)" class="ti-pencil hfr-button-green hfr-shrink hfr-button-link"></a>
																<a tooltip-placement="top" tooltip="{{'static.layout.delete' | translate}}" href ng-click="deleteSitemap(selector.id, blog.url, selector.sitemapId)" class="ti-close hfr-button-red hfr-shrink hfr-button-link"></a>
															</td>
														</tr>
													</tbody>
												</table>
											</div>
											<hr />
											
											<div class="row">
												<div class="col-md-12 content-right">
						
													<a href class="hfr-button-blue hfr-solid" ng-click="addSitemap(blog.url)">{{'static.siteManagement.btnAddSitemap' | translate}}</a>
						
												</div>
											</div>
										</div>
									</div>
								</div>
							</li>
						</ul>
					</div>
				</div>
			</form>
		</div>
		<!-- =============== End view =============== -->
	</div>
</div>